<template>
    <div>
        <ChaView>
                <img  @click="per" src="./left.png" alt="">
                <h3>{{$route.query.name}}</h3>
        </ChaView><br><br>
        <div class="san">
            <img  class="img" :src="$route.query.img" alt="">
        <div class="rigthl">
            <h3>{{$route.query.name}}</h3>
            <el-rate
  v-model="value"
  disabled
  text-color="#ff9900"
  score-template="{value}">
</el-rate><br><br>
            <span>{{$route.query.Rate}}</span><br>
            <span>{{$route.query.Type}}</span>
            <P class="w">{{$route.query.Actors}}</P>
            <span>上映时间:{{$route.query.ReleaseTime}}</span>
        </div>
        </div>
        <div class="jie">
            {{$route.query.Intro}}
        </div>
        <router-link :to="{path:'/chang',query:{id:$route.query.id,name:$route.query.name,Rate:$route.query.Rate}}">
        <button  class="btu">立即购票</button>
        </router-link>
    <router-view/>
    </div>
</template>
<style lang="scss">
.btu{
    position: fixed;
    bottom: 30%;
    width: 100vw;
    height: 5vh;
    border: none;
    background-color: #009CDC;
    color: white;
    font-weight: 600;
    font-size: 16px;
    z-index: 100;
}
.jie{
    width: 100vw;
    height: 45rem;
    text-indent: 20px;
    font-size: 15px;
    line-height: 20px;
}
span{
    line-height: 25px;
}
.w{
    width: 170px;
    height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.san{
    width: 100vw;
    height: 23vh;
    background: url(./bg.jpg) no-repeat;
    margin-top: 0%;
    .img{
        border: 2px solid #85959B;
        width: 30vw;
        height: 20vh;
        margin-left: 3%;
        margin-top: 3%;
    }
}
h3{
    color: white;
}
.rigthl{
    height: 90%;
    width: 60%;
    margin-left: 37%;
    z-index: 100;
    margin-top: -45%;
    color: white;
}
</style>

<script>
import ChaView from '@/components/ChaView.vue'
export default {
    components: {
    ChaView,
},
    data() {
        return {
            id: this.$route.query.id,
            value:this. $route.query.Rate/2,
        };
    },
    methods: {
        but() {
            
        },
 per() {
        this.$router.go(-1)
      },
    }, 
    mounted() {
        this.axios.get('Movie/Shows?MovieID=' + this.id).then(res => {
            console.log(res.data);
            this.list = res.data.Movie;
        })
    },
   
};
</script>

